<template>
    <base-breadcrumb :title="$route.meta.title">
      <a-card>
          <title-name title="团员信息"></title-name>
          <a-form-model class="flex-model-form"
            ref="addForm"
            :model="detail"
            :rules="rules"
          >
            <a-col :span="8" v-for="(item, index) in formDatas" :key="item.key">
                 <a-form-model-item :label="item.name">
                   <BaseInput :value="formatValue(item)" disabled></BaseInput>
                 </a-form-model-item>
            </a-col>
          </a-form-model>
      </a-card>
      <a-affix class="btn_box page-btn-right-top" :offset-bottom="40">
        <a-button @click="handleClose">关闭</a-button>
      </a-affix>
    </base-breadcrumb>
</template>

<script>
import { Affix } from 'ant-design-vue' // ant
import BaseInput from '@/components/BaseInput'
import { getYouthMemberById } from '@/api/partyMasses/leagueManage'
export default {
    name:'a'+ Date.now(),
    // name: 'AddPartyOrg',
    components: {
      AAffix: Affix,
      BaseInput,
    },
    computed: {
    },
    mounted() {
      const param = {id: this.$route.query.id};
      getYouthMemberById(param).then((res) => {
        if (res && res.code == 0) {
          this.detail = res.data;
        }
        // this.detail.form = res.data;
      })
    },
    data() {
        return {
          btnloading: false,
          showDuesModal: false,
          showDevelopmentModal: false,
          formDatas: [
            {key: 'userName', name: '团员名称'},
            {key: 'leagueTime', name: '入团时间'},
            {key: 'duesEndTime', name: '团费缴至时间'},
            {key: 'employeeNum', name: '员工编号'},
            {key: 'phone', name: '手机号码'},
            {key: 'currentPost', name: '当前岗位'},
            {key: 'idCard', name: '身份证号'},
            {key: 'sex', name: '性别', map: { '0': '女', '1': '男'}},
            {key: 'birthday', name: '出生日期'},
            {key: 'age', name: '年龄'},
            {key: 'specialitieMax', name: '最高学历'},
            {key: 'email', name: '邮箱'},
            {key: 'youthOrgName', name: '当前所在团支部'},
            {key: 'youthPost', name: '团内职务'},
            {key: 'statusName', name: '状态'},
          ],
          detail: {
          },
          rules: {
          }
        }
    },
    watch:{
      // 'detail.type': {
      //   handler(nv, old) {
      //     if (nv !== 1) {
      //     }
      //   }
      // }
    },
    methods: {
      formatValue(item) {
        const value = this.detail[item.key];
        if (item.map) {
          return item.map[value]
        }
        return value
      },
      handleClose() {
        this.$multiTab.close(this.$route.fullpath);
      },
    }
}
</script>

<style lang="less" scoped>
  .ant-form-item{
    display: flex;
  }
  .btn_box .ant-affix{
    overflow: hidden;
    button {
      float: right;
      margin-left: 20px;
    }
  }
</style>
